// 音乐播放器功能
document.addEventListener('DOMContentLoaded', function() {
    // 获取DOM元素
    const audio = new Audio();
    const playPauseBtn = document.getElementById('play-pause-btn');
    const playPauseIcon = document.getElementById('play-pause-icon');
    const prevBtn = document.getElementById('prev-btn');
    const nextBtn = document.getElementById('next-btn');
    const progressBar = document.getElementById('progress-bar');
    const progress = document.getElementById('progress');
    const volumeBar = document.getElementById('volume-bar');
    const volumeProgress = document.getElementById('volume-progress');
    const currentTitle = document.getElementById('current-title');
    const currentArtist = document.getElementById('current-artist');
    const currentCover = document.getElementById('current-cover');

    // 音乐数据
    const musicData = [
        {
            id: 1,
            title: '稻香 to sleep',
            artist: 'Luv Resonance',
            cover: 'https://picsum.photos/seed/music1/200/200',
            audio_url: 'https://example.com/music1.mp3'
        },
        {
            id: 2,
            title: 'Sonic Dreams',
            artist: 'Deep Tech',
            cover: 'https://picsum.photos/seed/music2/200/200',
            audio_url: 'https://example.com/music2.mp3'
        },
        {
            id: 3,
            title: 'Echoes of Time',
            artist: 'Synthwave Collective',
            cover: 'https://picsum.photos/seed/music3/200/200',
            audio_url: 'https://example.com/music3.mp3'
        },
        {
            id: 4,
            title: 'Neon Dreams',
            artist: 'Retro Future',
            cover: 'https://picsum.photos/seed/music4/200/200',
            audio_url: 'https://example.com/music4.mp3'
        },
        {
            id: 5,
            title: 'Midnight',
            artist: 'Urban Dreams',
            cover: 'https://picsum.photos/seed/music5/200/200',
            audio_url: 'https://example.com/music5.mp3'
        }
    ];

    let currentTrackIndex = 0;
    let isPlaying = false;

    // 加载歌曲函数
    function loadTrack(index) {
        const track = musicData[index];
        audio.src = track.audio_url;
        currentTitle.textContent = track.title;
        currentArtist.textContent = track.artist;
        currentCover.src = track.cover;
        currentCover.alt = track.title;

        // 更新播放/暂停图标
        if (isPlaying) {
            audio.play();
            playPauseIcon.classList.remove('fa-play');
            playPauseIcon.classList.add('fa-pause');
        }
    }

    // 播放歌曲函数
    function playTrack() {
        audio.play();
        isPlaying = true;
        playPauseIcon.classList.remove('fa-play');
        playPauseIcon.classList.add('fa-pause');
    }

    // 暂停歌曲函数
    function pauseTrack() {
        audio.pause();
        isPlaying = false;
        playPauseIcon.classList.remove('fa-pause');
        playPauseIcon.classList.add('fa-play');
    }

    // 播放/暂停按钮点击事件
    playPauseBtn.addEventListener('click', function() {
        if (audio.src) {
            if (isPlaying) {
                pauseTrack();
            } else {
                playTrack();
            }
        } else {
            // 如果没有加载歌曲，加载第一首歌曲
            loadTrack(0);
            playTrack();
        }
    });

    // 上一首按钮点击事件
    prevBtn.addEventListener('click', function() {
        currentTrackIndex = (currentTrackIndex - 1 + musicData.length) % musicData.length;
        loadTrack(currentTrackIndex);
        playTrack();
    });

    // 下一首按钮点击事件
    nextBtn.addEventListener('click', function() {
        currentTrackIndex = (currentTrackIndex + 1) % musicData.length;
        loadTrack(currentTrackIndex);
        playTrack();
    });

    // 进度条点击事件
    progressBar.addEventListener('click', function(e) {
        const rect = progressBar.getBoundingClientRect();
        const pos = (e.clientX - rect.left) / rect.width;
        audio.currentTime = pos * audio.duration;
    });

    // 音量条点击事件
    volumeBar.addEventListener('click', function(e) {
        const rect = volumeBar.getBoundingClientRect();
        const pos = (e.clientX - rect.left) / rect.width;
        audio.volume = pos;
        volumeProgress.style.width = `${pos * 100}%`;
    });

    // 时间更新事件
    audio.addEventListener('timeupdate', function() {
        const percent = (audio.currentTime / audio.duration) * 100;
        progress.style.width = `${percent}%`;
    });

    // 歌曲结束事件
    audio.addEventListener('ended', function() {
        currentTrackIndex = (currentTrackIndex + 1) % musicData.length;
        loadTrack(currentTrackIndex);
        playTrack();
    });

    // 初始化音量
    audio.volume = 0.7;
    volumeProgress.style.width = '70%';

    // 为音乐卡片中的播放按钮添加事件监听器
    const playButtons = document.querySelectorAll('.play-btn');
    playButtons.forEach((btn, index) => {
        btn.addEventListener('click', function() {
            currentTrackIndex = index;
            loadTrack(currentTrackIndex);
            playTrack();
        });
    });
});
